<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8" isELIgnored="false"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<c:if test="${ not empty sessionScope['lang'] }">
	<fmt:setLocale value="${ sessionScope['lang'] }" scope="session" />
</c:if>
<fmt:setBundle basename="labels" var="labels" />
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title><fmt:message bundle="${ labels }" key="PAGE_TITLE" /></title>
<script type="text/javascript" src="js/main.js"></script>
<link rel="stylesheet" type="text/css" href="style/main.css" />
</head>
<body>

	<div id="title_bar">
		<div id="admin_data">
			<c:choose>
				<c:when test="${ empty admin }">
					<form action="login" method="post">
						<label><fmt:message bundle="${ labels }" key="ADMIN_ID" />
						</label> <input type="text" name="admin_user" value="${ admin }" /> <label><fmt:message
								bundle="${ labels }" key="ADMIN_PASSWORD" /> </label><input
							type="password" name="admin_password" /> <input type="submit"
							value="<fmt:message bundle="${ labels }" key="LOGIN" />" />
					</form>
				</c:when>
				<c:otherwise>
					<c:out value="${ admin }" />
					<a href="logout"><fmt:message bundle="${ labels }" key="LOGOUT" />
					</a>
				</c:otherwise>
			</c:choose>
		</div>

		<div id="language">
			<c:set var="en_selected" value="" scope="page" />
			<c:set var="ja_selected" value="" scope="page" />
			<c:if test="${ fn:startsWith(sessionScope['lang'], 'en') }">
				<c:set var="en_selected" value='selected="selected"' scope="page" />
			</c:if>
			<c:if test="${ fn:startsWith(sessionScope['lang'], 'ja') }">
				<c:set var="ja_selected" value='selected="selected"' scope="page" />
			</c:if>

			<label><fmt:message bundle="${labels}" key="LANGUAGE" /> </label> <select
				onchange="setLanguage(this.value)">
				<option value="en"${ en_selected }>
					<fmt:message bundle="${ labels }" key="LANGUAGE_ENGLISH" />
				</option>
				<option value="ja"${ ja_selected }>
					<fmt:message bundle="${ labels }" key="LANGUAGE_JAPANESE" />
				</option>
			</select>
		</div>

		<div id="navigation">
			<input type="button"
				value="<fmt:message bundle="${labels}" key="USER_TITLE" />"
				onclick="loadUsers()" /> <input type="button"
				value="<fmt:message bundle="${labels}" key="GROUP_TITLE" />"
				onclick="loadGroups()" />
		</div>
	</div>

	<c:if test="${ not empty userMessage }">
		<div id="user_message">
			<c:out value="${ userMessage }" />
		</div>
	</c:if>

	<c:if test="${ not empty userList }">
		<c:forEach var="user" items="${ userList }" varStatus="loop">
			<c:set var="rowClass" value="type_a" scope="page" />
			<c:if test='${(loop.count)%2 eq 0}'>
				<c:set var="rowClass" value="type_b" scope="page" />
			</c:if>
			<div class="${rowClass}">
				<div class="entry_title">
					<img id="toggleBox_${ user.userName }" alt="open"
						src="img/expand.gif"
						onclick="toggleBox('toggleBox_${ user.userName }', 'subdisplay_${ user.userName }')">
					<c:out value="${ user.userName }" />

					<input type="button"
						value="<fmt:message bundle="${labels}" key="DELETE" />"
						onclick="deleteUser('${ user.userName }')" />

				</div>
				<div id="subdisplay_${ user.userName }" class="subdisplay">
					<table class="data_table">
						<tr>
							<th><fmt:message bundle="${labels}"
									key="DATA_USER_FAMILYNAME" /></th>
							<th><fmt:message bundle="${labels}"
									key="DATA_USER_GIVENNAME" /></th>
							<th><fmt:message bundle="${labels}" key="DATA_USER_ADMIN" />
							</th>
							<th><fmt:message bundle="${labels}"
									key="DATA_USER_CHANGE_PASSWORD" />
							</th>
							<th><fmt:message bundle="${labels}"
									key="DATA_USER_IP_WHITELIST" />
							</th>
							<th><fmt:message bundle="${labels}"
									key="DATA_USER_SUSPENDED" /></th>
							<th><fmt:message bundle="${labels}" key="DATA_USER_NICKNAME" />
							</th>
							<th><fmt:message bundle="${labels}" key="DATA_USER_SEND_AS" />
							</th>
						</tr>

						<tr>
							<td><div>
									<c:out value="${ user.familyName }" />
								</div>
							</td>
							<td><div>
									<c:out value="${ user.givenName }" />
								</div>
							</td>
							<td><div>
									<c:out value="${ user.admin }" />
								</div>
							</td>
							<td><div>
									<c:out value="${ user.changePasswordAtNextLogin }" />
								</div>
							</td>
							<td><div>
									<c:out value="${ user.ipWhitelisted }" />
								</div>
							</td>
							<td><div>
									<c:out value="${ user.suspended }" />
								</div>
							</td>
							<td class="nickname"><div>
									<input type="button" id="nickname_button_${ user.userName }"
										onclick="loadNicknames('${ user.userName }')"
										value="<fmt:message bundle="${labels}"
									key="GET_NICKNAMES" />" />
									<div id="nickname_list_${ user.userName }"
										class="nickname_list"></div>
								</div></td>
							<td class="sendas"><div>
									<input type="button" id="sendas_button_${ user.userName }"
										onclick="loadSendAs('${ user.userName }')"
										value="<fmt:message bundle="${labels}"
									key="GET_SENDAS" />" />
									<div id="sendas_list_${ user.userName }" class="sendas_list"></div>
								</div></td>
						</tr>
					</table>
				</div>
			</div>
		</c:forEach>
	</c:if>

	<c:if test="${ not empty groupList }">
		<c:forEach var="group" items="${ groupList }" varStatus="loop">

			<c:set var="rowClass" value="type_a" scope="page" />
			<c:if test='${(loop.count)%2 eq 0}'>
				<c:set var="rowClass" value="type_b" scope="page" />
			</c:if>

			<div class="${rowClass}">
				<div class="entry_title">
					<img id="toggleBox_${ group.groupId }" alt="open"
						src="img/expand.gif"
						onclick="toggleBox('toggleBox_${ group.groupId }', 'subdisplay_${ group.groupId }')">
					<c:out value="${ group.groupId }" />
					<input type="button"
						value="<fmt:message bundle="${labels}" key="DELETE" />"
						onclick="deleteGroup('${ group.groupId }')" />
				</div>

				<div id="subdisplay_${ group.groupId }" class="subdisplay">
					<table class="data_table">
						<tr>
							<th><fmt:message bundle="${labels}" key="DATA_GROUP_NAME" />
							</th>
							<th><fmt:message bundle="${labels}"
									key="DATA_GROUP_DESCRIPTION" />
							</th>
							<th><fmt:message bundle="${labels}"
									key="DATA_GROUP_EMAIL_PERMISSION" />
							</th>
							<th><fmt:message bundle="${labels}" key="DATA_GROUP_MEMBERS" />
							</th>
							<th><fmt:message bundle="${labels}" key="DATA_GROUP_OWNERS" />
							</th>
						</tr>

						<tr>
							<td><div>
									<c:out value="${ group.groupName }" />
								</div>
							</td>
							<td><div>
									<c:out value="${ group.description }" />
								</div>
							</td>
							<td><div>
									<c:out value="${ group.emailPermission }" />
								</div>
							</td>
							<td class="group_member"><div>
									<input type="button" id="member_button_${ group.groupId }"
										onclick="loadGroupMembers('${ group.groupId }')"
										value="<fmt:message bundle="${labels}"
									key="GET_GROUP_MEMBERS" />" />
									<div id="group_member_list_${ group.groupId }"
										class="group_member_list"></div>
								</div>
							</td>
							<td class="group_owner"><div>
									<input type="button" id="owner_button_${ group.groupId }"
										onclick="loadGroupOwners('${ group.groupId }')"
										value="<fmt:message bundle="${labels}"
									key="GET_GROUP_OWNERS" />" />
									<div id="group_owner_list_${ group.groupId }"
										class="group_owner_list"></div>
								</div>
							</td>
						</tr>
					</table>
				</div>
			</div>
		</c:forEach>
	</c:if>

	<div id="icon">
		<img
			src="http://code.google.com/appengine/images/appengine-noborder-120x30.gif"
			alt="Powered by Google App Engine" />
	</div>

</body>
</html>